<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>湖南省民办教育协会</title>
	<meta name="keywords" content="">
	<meta name="description" content="">
	<link rel="stylesheet" type="text/css" href="./css/banner.css">
	<link rel="stylesheet" type="text/css" href="./css_files/base.css">
	<link rel="stylesheet" type="text/css" href="./css_files/index.css">
	<link rel="stylesheet" type="text/css" href="./css_files/style.css">
	<script type="text/javascript" charset="utf-8" src="./css_files/jquery-1.11.2.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="./css_files/jqslider.js"></script>
    <title>跑马灯图片循环</title>
    <style>
       .tt {
       	width: 280px;
       	height: 180px;
       	margin-left: 16px;
       	margin-right: 16px;
       	margin-top: 10px;
       	display: block;
       }
    </style>
</head>
<body>
	<div id="colee_left" style="margin: auto; width: 1500px;overflow: hidden;">
		<table cellpadding="0">
			<tbody>
				<tr>
					<td id="colee_left1" valign="top">
						<table>
							<tbody>
								<tr align="center">
									<td>
										<img class="tt" src="http://www.hngsxy.com/r3/imgs/wskx/IMG_20180327_115013.jpg" />
										<span>1111</span>
									</td>
									<td>
										<img class="tt" src="http://www.hngsxy.com/r3/imgs/wskx/IMG_2895.JPG" />
										<span>222</span>
									</td>
									<td>
										<img class="tt" src="http://www.hngsxy.com/r3/imgs/wskx/zyimg10.jpg" />
										<span>333</span>
									</td>
									<td>
										<img class="tt" src="http://www.hngsxy.com/r3/imgs/wskx/zytpimg11.jpg" />
										<span>444</span>
									</td>
									<td>
										<img class="tt" src="http://www.hngsxy.com/r3/imgs/wskx/zytpimg12.jpg" />
										<span>555</span>
									</td>
									<td>
										<img class="tt" src="http://www.hngsxy.com/r3/imgs/wskx/zytpimg13.jpg" />
										<span>666</span>
									</td>
									<td>
										<img class="tt" src="http://www.hngsxy.com/r3/imgs/wskx/zytpimg14.jpg" />
										<span>777</span>
									</td>
									<td>
										<img class="tt" src="https://www.hngsxy.com/houqiimg/ppqqqt.png" />
										<span>888</span>
									</td>
									<td>
										<img class="tt" src="https://www.hngsxy.com/houqiimg/fff1.png" />
										<span>999</span>
									</td>
								</tr>
							</tbody>
						</table>
					</td>
					<td id="colee_left2" valign="top">
					</td>
				</tr>
			</tbody>
		</table>
	</div>
</body>
<script>
	var zichangdu = 1;
	var speed = 20;
	//速度数值越大速度越慢
	var colee_left2 = document.getElementById("colee_left2");
	var colee_left1 = document.getElementById("colee_left1");
	var colee_left = document.getElementById("colee_left");
	colee_left2.innerHTML = colee_left1.innerHTML;
	function Marquee3() {
		if(colee_left2.offsetWidth - colee_left.scrollLeft <= 0) { //offsetWidth 是对象的可见宽度
			colee_left.scrollLeft -= colee_left1.offsetWidth //scrollWidth 是对象的实际内容的宽，不包边线宽度
		} else {
			colee_left.scrollLeft++;
		}
	}
	var MyMar3 = setInterval(Marquee3, speed);
</script>
</html>